<!DOCTYPE html>
<html>
<head>
    <meta charset="utf-8">
    <link rel='stylesheet' href='/stylesheets/header.css' />
    <link href="//netdna.bootstrapcdn.com/font-awesome/4.7.0/css/font-awesome.min.css" rel="stylesheet">
    <meta name="viewport" content="width=device-width, height=device-height, initial-scale=1.0, maximum-scale=1.0"/>
    <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/codemirror/5.3.0/codemirror.min.css">

    <script type="text/javascript" charset="utf-8" src="/ueditor/ueditor.config.js"></script>
    <script type="text/javascript" charset="utf-8" src="/ueditor/ueditor.all.min.js"> </script>
    <script type="text/javascript" charset="utf-8" src="/ueditor/lang/zh-cn/zh-cn.js"> </script>

    <style>
        body {
            margin: 0;
            padding: 0;

        }

        .titleDiv{
            width: 81%;
            margin: 0 auto;
            padding-top: 1px;
        }
        .titleName{
            margin-top: 80px;
        }
        .titleName,.describeTitle{
            text-align: left;
            display: block;
            font-weight: 600;
            margin-bottom: 15px;
            font-size: 16px;
        }
        .describe{
            font-size: 12px;
        }
        section {
            width: 81%;
            margin: auto;
            text-align: left;
        }
        .fr-element{
            height: 300px;
        }
        #submitB{
            background-color: #337ab7;
            border-color: #2e6da4;
            color: #fff;
            -moz-user-select: none;
            background-image: none;
            border: 1px solid transparent;
            border-radius: 4px;
            cursor: pointer;
            display: inline-block;
            font-size: 14px;
            font-weight: normal;
            line-height: 1.42857;
            margin-bottom: 0;
            padding: 6px 12px;
            text-align: center;
            vertical-align: middle;
            white-space: nowrap;
        }
    </style>
</head>

<body ng-app="myApp">
<% include header.html %>
<div class="titleDiv">
    <span class="titleName">文章标题</span>
    <input type="text" name="title" class="title" placeholder="请输入文章标题" style="border: none;width: 100%" value="<%=article.title%>">
    <hr color="#999">
    <span class="describeTitle" >文章简介</span>
    <textarea style="border: none;width: 100%" class="describe" placeholder="请输入文章简介"><%=article.title%></textarea>
    <div class="content1" style="display: none"></div>
    <script id="editor1" type="text/plain" style="width:100%;height:500px;">
    </script>
    <input type="button" id="submitB" value="保存" >
    <a href="/operator/edit" style="font-size: 15px;color: #3053c6">再写一篇</a>
</div>

<!--<section id="editor">
    <div id='edit' style="margin-top: 10px;">
    </div>

</section>-->

<script type="text/javascript" src="/javascripts/angular.min.js"></script>
<script type="text/javascript" src="/javascripts/myApp.js"></script>
<script type="text/javascript" src="/javascripts/header1.js"></script>
<script type="text/javascript" src="/javascripts/jquery.js"></script>
<script type="text/javascript" src="/javascripts/umeditor.config.js"></script>
<script type="text/javascript" src="/javascripts/umeditor.min.js"></script>
<script>
    $(function(){
        var ue = UE.getEditor('editor1', {
            toolbars: [
                [
                    'undo', //撤销
                    'redo', //重做
                    'bold', //加粗
                    'indent', //首行缩进
                    'italic', //斜体
                    'underline', //下划线
                    'strikethrough', //删除线
                    'subscript', //下标
                    'fontborder', //字符边框
                    'superscript', //上标
                    'formatmatch', //格式刷
                    'blockquote', //引用
                    'horizontal', //分隔线
                    'fontfamily', //字体
                    'fontsize', //字号
                    'paragraph', //段落格式
                    'simpleupload', //单图上传
                    'insertimage', //多图上传
                    'link', //超链接
                    'emotion', //表情
                    'spechars', //特殊字符
                    'justifyleft', //居左对齐
                    'justifyright', //居右对齐
                    'justifycenter', //居中对齐
                    'justifyjustify', //两端对齐
                    'forecolor', //字体颜色
                    'backcolor', //背景色
                    'insertorderedlist', //有序列表
                    'insertunorderedlist', //无序列表
                    'directionalityltr', //从左向右输入
                    'directionalityrtl', //从右向左输入
                    'rowspacingtop', //段前距
                    'rowspacingbottom', //段后距
                    'pagebreak', //分页
                    'imagenone', //默认
                    'imageleft', //左浮动
                    'imageright', //右浮动
                    'imagecenter', //居中
                    'lineheight', //行间距
                    'inserttable', //插入表格
                    'print',//打印
                    'drafts',//草稿箱
                    'source'//源代码
                ]
            ],
            autoHeightEnabled: false,
            autoFloatEnabled: true,
        });
        if('<%=article.content%>'!=""){
            $('.content1').load('<%=article.content%>');
        }

        ue.ready(function() {
            var content =$('.content1').html();
            //设置编辑器的内容
            ue.setContent(content);
            var html = ue.getContent();
            var txt = ue.getContentTxt();
        });
        $('#submitB').click(function () {
            var title=$(".title").val();
            var content=$("#ueditor_0").contents().find("body").html();
            var describe=$('.describe').val();
            var  id='<%=article._id%>';
            var obj={
                title:title,
                content:content,
                describe:describe,
                id:id
            };
            $.ajax({
                data: obj,
                url: '/article/save1',
                type: "post",
                dataType: 'json',
                success: function (data) {
                    alert("success");
                }
            });
        });
    });
</script>
</body>
</html>